<template >
	<div class="contain-report">
		<div class="report-title">我的信息</div>
		<div class="report-form">
			<el-form ref="form"  label-width="80px" size="medium">
				<el-form-item label="姓名:">
					<el-input placeholder="请输入姓名" v-model="form.userName"></el-input>
				</el-form-item>
				<el-form-item label="电话:">
					<el-input  placeholder="请输入电话" v-model="form.phone"></el-input>
				</el-form-item>
				
				<el-form-item label="学号:">
					<el-input  placeholder="请输入学号" v-model="form.studentNumber"></el-input>
				</el-form-item>
			</el-form>
		</div>
		<div style="margin: 50px auto;display: flex;justify-content: center">
			<el-button type="primary" @click="changeForm">更改信息</el-button>
		</div>
	</div>
</template >

<script >
  import {studentData } from "../api/user";

  export default {
        data(){
            return{
                userInfo:{},
                form:{
                    phone: "",
                    studentNumber: "",
                    userName: ""
                }
            }
        },
        created() {
            this.userInfo = JSON.parse(sessionStorage.getItem('user'))
            this.form.phone = this.userInfo.phone
            this.form.studentNumber = this.userInfo.studentNumber
            this.form.userName = this.userInfo.userName
        },
        methods: {
            async changeForm(){
                for (let key in this.form){
                    if (!this.form[key]){
                        return this.$message.error('请将参数填写完整')
                    }
                }
                const { data } = await studentData(this.form)
                if (data.code === 200){
                    this.$message.success('修改成功,请重新登录!')
                    sessionStorage.clear()
                    setTimeout(()=>{
                        this.$router.replace('/')
                    },2000)
                }
            }
        },
    }
</script >

<style scoped lang="less">
	.contain-report{
		position: relative;
		width: 100%;
		height: 100%;
		padding: 20px;
		box-sizing: border-box;
		.report-title{
			font-size: 22px;
			color: #666;
		}
		.report-form{
			width: 50%;
			height: 200px;
			margin: 0 auto;
		}
	}
</style >
